<template>
  <div class="app-container">
    <div v-for="(code, idx) in tableData" :key="idx">
      <p class="active-code">{{ code }}</p>
    </div>
  </div>
</template>

<script setup>
import { computed, onMounted, ref } from 'vue'
import { getActiveCode } from '@/api/auth'
import { useUserStore } from '@/store/user'

const tableData = ref([])
const userStore = useUserStore()
const sysUser = computed(() => userStore.sysUser)

onMounted(async () => {
  const { active_code_lists } = await getActiveCode({
    cnt: 1,
    time: 999,
    device_num: sysUser.value.max_devices,
    mall_num: sysUser.value.max_mallShops
  })
  tableData.value = active_code_lists
})
</script>

<style lang="scss" scoped>
.app-container {
  margin: 20px;
  padding: 20px;
  background-color: #fff;
  .active-code {
    padding: 10px 20px;
    color: #67c23a;
    word-break: break-all;
  }
}
</style>
